{% macro loadMore(pageIndex,pageSize,count,api,isCanReply) %}
<button class="btn btn-success btn-load-more">加载更多....</button>

<script>
  const pageIndex = parseInt('{{pageIndex}}')
  const pageSize = parseInt('{{pageSize}}');
  const count = parseInt('{{count}}')
  let nextPageIndex = pageIndex;
  console.log(pageIndex, pageSize, count)
  if (pageSize * pageIndex >= count) {
    $(".btn-load-more").hide()
  }
  $(".btn-load-more").click(function () {
    // api/profile/loadMore/zhangsan/2
    ajax.get('{{api}}' + nextPageIndex,
      function (err, res) {
        if (err) {
          alert(err)
        }
        nextPageIndex = res.pageIndex;  // res.pageIndex当前的页码
        // 渲染dom
        res.blogList.forEach(item => {
          let $image = "";
          if (item.image) {
            $image = `
            <a href="${item.image}" target="_blank">
              <img class="blog-image" src="${item.image}" alt="" width="100">
            </a>`
          }
          const $loadMoreTemplate = ` <div class="blog-item">
        <div class="user-info">
          <img class="user-avatar" src="${item.user.avatar}" alt="" style="border-radius: 50%; " width="50px"
            height="50px">
        </div>
        <div class="blog-info">
          <div class="blog-content" style="word-break:break-word">
            <div>
              <a href="/profile/{{item.user.userName}}"><span class="username">${item.user.nickName}</span>:</a>
              <span class="text">${item.formatContent}</span>
            </div>
           ${$image}
          </div>
          <div class="create-time">
            <span>${item.createdAtFormat}</span>
            {% if isCanReply %}
      <!-- 添加回复功能 -->
      <a href="#" class="reply"
      data-nick-name="${item.user.nickName}"
      data-user-name="${item.user.userName}"
      data-content="${item.content}"
      >
        <svg width="20px" height="20px" viewBox="0 0 16 16" class="bi bi-reply-all-fill" fill="currentColor"
          xmlns="http://www.w3.org/2000/svg">
          <path
            d="M8.079 11.9l4.568-3.281a.719.719 0 0 0 0-1.238L8.079 4.1A.716.716 0 0 0 7 4.719V6c-1.5 0-6 0-7 8 2.5-4.5 7-4 7-4v1.281c0 .56.606.898 1.079.62z" />
          <path fill-rule="evenodd"
            d="M10.868 4.293a.5.5 0 0 1 .7-.106l3.993 2.94a1.147 1.147 0 0 1 0 1.946l-3.994 2.94a.5.5 0 0 1-.593-.805l4.012-2.954a.493.493 0 0 1 .042-.028.147.147 0 0 0 0-.252.496.496 0 0 1-.042-.028l-4.012-2.954a.5.5 0 0 1-.106-.699z" />
        </svg>
        回复
      </a>
      {% endif %}
          </div>
        </div>
      </div>
      <hr>`
          $('.item-wrapper').append($loadMoreTemplate)
        })
        if (pageSize * (res.pageIndex) >= count) {
          $(".btn-load-more").hide()
        }
      })
  })
</script>
{%endmacro%}